<template>
    <Form ref="formValidate" class="exform" :model="formValidate" :label-width="80" :rules="ruleValidate">
		<FormItem label="单位全称" prop="commonproject.zh"  style="width:50%">
			<Input v-model="formValidate.commonproject.zh" placeholder="单位全称" style="width:80%">
			</Input>
		</FormItem>
		<FormItem label="所属部门或机构" prop="membername.zh"  style="width:50%">
			<Input v-model="formValidate.membername.zh" placeholder="所属部门或机构" style="width:80%">
			</Input>
		</FormItem>
		<FormItem label="行政职务" prop="membereducation.zh"  style="width:50%">
			<Input v-model="formValidate.membereducation.zh" placeholder="行政职务" style="width:80%">
			</Input>
		</FormItem>
		<FormItem label="工作内容" prop="memberpost.zh"  style="width:50%">
			<Input v-model="formValidate.memberpost.zh" placeholder="工作内容" style="width:80%">
			</Input>
		</FormItem>
		<FormItem label="单位性质" prop="property" style="width:50%" >
			<Select v-model="formValidate.property"  style="width:80%" transfer>
			<Option v-for="item in formItem.unitproperties" :value="item.dictionary_id" :key="item.dictionary_id"> {{item.dictionary_name.zh?item.dictionary_name.zh:item.dictionary_name.mn}}</Option>
			</Select>
		</FormItem>
		<FormItem label="单位电话" prop="phone"  style="width:50%">
			<Input v-model="formValidate.phone" placeholder="单位电话" style="width:80%">
			</Input>
		</FormItem>
		<FormItem label="籍贯" style="width:100%;" >
			<Select v-model="formValidate.sheng" style="width:23%" @on-change="native" transfer>
				<Option v-for="item in regionList" v-if="item.parent_id ==0" :value="item.id" :key="item.value">{{item.region_name.zh?item.region_name.zh:item.region_name.mn}}</Option>
			</Select>
			<Select v-model="formValidate.shi" style="width:23%" @on-change="city" transfer>
				<Option v-for="item in nativeCity" :value="item.id" :key="item.value">{{item.region_name.zh?item.region_name.zh:item.region_name.mn}}</Option>
			</Select>
			<Select v-model="formValidate.xian" style="width:23%" transfer>
				<Option v-for="item in nativeCounty" :value="item.id" :key="item.value">{{item.region_name.zh?item.region_name.zh:item.region_name.mn}}</Option>
			</Select>
			<Input v-model="formValidate.dizhi" placeholder="地址" style="width:23%">
			</Input>
		</FormItem>  
		<div style="width:90%;">
			<FormItem style="width:100%;margin:60px 0">
			<Button type="primary" @click="handleSubmit('formValidate')">保存</Button>
			</FormItem>
		</div>
		<div style="clear:both"></div>
		<Spin size="large" fix v-if="spinShow"></Spin>
    </Form>
</template>

<script>

  export default {

    props: {
        teacher_id: {
            type: [Number,String],
            default: null
        },
        infoId: {
            type: [Boolean,String,Number],
            default: false
        }
    },
    data () {
      	return {
            infoUrl:`api/teacher/v1/psbsqualification/info/${this.infoId}`,//请求单条数据
            saveUrl:'',//保存接口
            saveType:null,//保存方式
            spinShow:false,//加载动画

			infoOld:null,
			formItem:[],

			regionList:[],//省
			nativeCity:[],//市
			nativeCounty:[],//区

			formValidate: {
				teacher_id:this.teacher_id,    
				property:'',//单位性质
				phone:'',  //单位电话
				sheng:'',     //省
				shi:'',     //市
				xian:'',//县
				dizhi:'',//地址
				shenhe:1,       //审核
				commonproject:{
					zh:'',
					mn:'',
					en:'',
				},    //单位全称
				membername:{
					zh:'',
					mn:'',
					en:'',
				},    //所属部门或机构
				membereducation:{
					zh:'',
					mn:'',
					en:'',
				},    //行政职务
				memberpost:{
					zh:'',
					mn:'',
					en:'',
				},    //工作内容
			},
			ruleValidate: {
				// 单位性质
				property: [
					{ type:'number',required: true, message: '请选择单位性质', trigger: 'change' }
				],
				// 省
				sheng: [
					{ type:'number',required: true, message: '请选择省', trigger: 'change' }
				],
				// 市
				shi: [
					{ type:'number',required: true, message: '请选择市', trigger: 'change' }
				],
				// 县
				xian: [
					{ type:'number',required: true, message: '请选择县', trigger: 'change' }
				],
				//单位电话
				phone: [
					{ required: true, message: '请填写单位电话', trigger: 'blur' }
				],
				//地址
				dizhi: [
					{ required: true, message: '请填写地址', trigger: 'blur' }
				],
				//单位全称
				'commonproject.zh': [
					{ required: true, message: '请填写留学学校名称', trigger: 'blur' }
				],
				//所属部门或机构
				'membername.zh': [
					{ required: true, message: '请填写所属部门或机构', trigger: 'blur' }
				],
				//行政职务
				'membereducation.zh': [
					{ required: true, message: '请填写行政职务', trigger: 'blur' }
				],
				//工作内容
				'memberpost.zh': [
					{ required: true, message: '请填写工作内容', trigger: 'blur' }
				],

			},
      	}
    },
    methods: {
	 
	 
        /************************************************************
         * 
         * 点击省带市
         * 
         ************************************************************/
        native(val){
			this.formValidate.shi=null
			this.formValidate.xian=null
			this.spinShow=true//输入框禁用 
			this.$http.get('api/base/v1/get/region/list?pid='+val)
			.then(item=>{
				this.nativeCity=item.data
                this.formValidate.shi = parseInt(this.infoOld.shi)//用于默认选的 市
				this.spinShow=false//输入框禁用 
            })
			.catch(err => {
				if(err.code && err.code==422) {
					this.$Message.error(err.message);
				}
				this.spinShow=false//输入框禁用 
			});
		},
		
        /************************************************************
         * 
         * 点击市带区
         * 
         ************************************************************/
        city(val){
			this.formValidate.xian=null
			this.spinShow=true//输入框禁用 
			this.$http.get('api/base/v1/get/region/list?pid='+val)
			.then(item=>{
				this.nativeCounty=item.data
                this.formValidate.xian = parseInt(this.infoOld.xian)//用于默认选的 县
				this.spinShow=false//输入框禁用 
            })
			.catch(err => {
				if(err.code && err.code==422) {
					this.$Message.error(err.message);
				}
				this.spinShow=false//输入框禁用 
			});
        },
        
        /************************************************************
         * 
         * 单条数据请求
         * 
         ************************************************************/
        infoData(){
            this.spinShow=true//输入框禁用  
            this.$http.get(this.infoUrl).then(val=>{
                this.infoOld = JSON.parse(JSON.stringify(val.data))
                this.formValidate.property = parseInt(this.infoOld.property)//用于默认选的 单位性质
                this.formValidate.sheng = parseInt(this.infoOld.sheng)//用于默认选的 省
                this.native(this.infoOld.sheng)
                this.city(this.infoOld.shi)
                this.formValidate.shenhe = parseInt(this.infoOld.shenhe)//用于默认选的 审核
                this.formValidate.phone = this.infoOld.phone// 单位电话
                this.formValidate.dizhi = this.infoOld.dizhi// 地址

                this.formValidate.commonproject = this.infoOld.commonproject// 单位全称
                this.formValidate.membername = this.infoOld.membername// 所属部门或机构
                this.formValidate.membereducation = this.infoOld.membereducation// 行政职务
                this.formValidate.memberpost = this.infoOld.memberpost// 工作内容

                this.formValidate.school_id=this.infoOld.school_id;//学校
                this.formValidate.teacher_id=this.infoOld.teacher_id;//教师   
                this.spinShow=false//输入框禁用
            }).catch(err => {
				if(err.code && err.code==422) {
					this.$Message.error(err.message);
				}
                this.spinShow=false//输入框禁用
			});
        },
        /************************************************************
         * 
         * 提交时
         * 
         ************************************************************/
		handleSubmit (name) {
			this.$refs[name].validate((valid) => {
                if (valid) {       
                    this.spinShow=true//输入框禁用   
                    this.saveType(this.saveUrl,this.formValidate).then(val=>{
                        this.$emit('showParent',false)
                        this.$emit('backList',true)
                        this.$Message.success(val.message);
                        this.spinShow=false
                    }).catch(err => {
                        if (err.code && err.code == 422) {
                            this.$Message.error(err.message);
                        }
                        this.spinShow=false
                    })  
                } else {
                    this.$Message.error('表单验证失败!');
                }
			})
		},
    },
    created() {
		
        /************************************************************
         * 
         * 查询专业类别和专家类别
         * 
         ************************************************************/
		this.$http.get('api/dictionary/v1/dictionary/pidquerys?unitproperties')
		.then(val=>{
			this.formItem = val.data
			this.spinShow=false//输入框禁用 
		})
		.catch(err => {
			if(err.code && err.code==422) {
				this.$Message.error(err.message);
			}
			this.spinShow=false//输入框禁用 
		});
		  
        /************************************************************
         * 
         * 地区
         * 
         ************************************************************/
        this.$http.get('api/base/v1/get/region/list')
		.then(val=>{
			this.regionList = val.data
			this.spinShow=false//输入框禁用 
		})
		.catch(err => {
			if(err.code && err.code==422) {
				this.$Message.error(err.message);
			}
			this.spinShow=false//输入框禁用 
		});
        if(this.infoId==false){
            // add
            this.UpImgShow=true
            this.saveUrl='api/teacher/v1/psbsqualification/add'
            this.saveType=this.$http.post

        }else{
            // edit
            this.infoData();
            this.saveUrl=`api/teacher/v1/psbsqualification/edit/${this.infoId}`
            this.saveType=this.$http.post
        }
    },
}
</script>
<style lang="less">
@import'./../public.less';
</style>
